<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    index.html
    <script>
        if ('serviceWorker' in navigator) {
            navigator.serviceWorker.register('sw.js', {
                scope: './'
            }).then(function (registration) {
                var serviceWorker;
                if (registration.installing) {
                    serviceWorker = registration.installing;
                    document.querySelector('#kind').textContent = 'installing';
                } else if (registration.waiting) {
                    serviceWorker = registration.waiting;
                    document.querySelector('#kind').textContent = 'waiting';
                } else if (registration.active) {
                    serviceWorker = registration.active;
                    document.querySelector('#kind').textContent = 'active';
                }
                if (serviceWorker) {
                    // logState(serviceWorker.state);
                    serviceWorker.addEventListener('statechange', function (e) {
                        // logState(e.target.state);
                    });
                }
            }).catch(function (error) {
                // Something went wrong during registration. The service-worker.js file
                // might be unavailable or contain a syntax error.
            });
        } else {
            // The current browser doesn't support service workers.
        }
    </script>
</body>

</html>